<template>
	<div id="app">
		<nav>
			<router-link to="/" tag="span">商品列表</router-link>
			<router-link to="/shopcart" tag="span">购物车</router-link>
		</nav>
		<router-view />
	</div>
</template>
<style type="text/css">
	*{
		padding: 0;
		margin: 0;
	}
	
</style>
<style scoped>
	#app {
		font-family: Avenir, Helvetica, Arial, sans-serif;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		/* text-align: center; */
		color: #2c3e50;
	}

	nav {
		position: fixed;
		bottom: 0;
		width: 100%;
		z-index: 100;
	}

	nav span {
		width: 50%;
		display: inline-block;
		text-align: center;
		border-top: 1px solid #ccc;
		height: 50px;
		line-height: 50px;
		background-color: white;
	}

	nav span.router-link-exact-active {
		color: #F18741;
		background: #FEF5EF;
		font-weight: bold;
	}
</style>
